<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body style="text-align:center">

    <h1>当点击注册时会验证数值</h1> 
    <p>各个框内数值不能为空</p>
    <p>email需符合电子邮件格式</p>
    <p>两次密码要一致</p>
    <p>姓名只能中文</p>
    <p>若某一条件不满足会弹出提示</p> 

<form action="#" method="GET" name="zuoye"></form>

<table align="center">
<tr>
    <td style="text-align:right">您的Email：</td>
    <td><input type="text" id="email"></td>
</tr>

<tr>
    <td style="text-align:right">输入密码：</td>
    <td><input type="password" id="pass1"></td>
</tr>

<tr>
    <td style="text-align:right">再输入一遍密码：</td>
    <td><input type="password" id="pass2"></td>
</tr>

<tr>
    <td style="text-align:right">您的姓名：</td>
    <td><input type="text" id="uname"></td>
</tr>

<tr align="left">
    <td style="text-align:right">性别：</td>
    <td>
        <input type= "radio" id="sex" name="sex"><label for="sex">男</label>
        <input type= "radio" id="sex" name="sex"><label for="sex">女</label>

    </td>
</tr>

<tr>
    <td style="text-align:right">出生日期：</td>
    <td>
    <select style="display: inline-block;width: 60px;">
        <option>1900</option>
        <option>1901</option>
        <option>1902</option>
        <option>偷个懒</option>
    </select> <span>年</span>
    <select style="display: inline-block;width: 40px;">
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>偷个懒</option>
    </select> <span>月</span>
    <select style="display: inline-block;width: 40px;">
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>偷个懒</option>
    </select> <span>日</span>

</td>
</tr>

<tr>
    <td></td>
    <td align="left">
        <button href="#"style="background-color: rgb(121, 121, 121);color: white;text-decoration: none;" 
        onclick="check()">注册</button>
    </td>
</tr>



</table>


<style>

</style>

<script>

</script>



<script>

 function check() {
     var email=document.getElementById("email");
     var pass1=document.getElementById("pass1");
     var pass2=document.getElementById("pass2");
     var name=document.getElementById("uname").value;

    if(email.value == ''){
        alert("邮箱不能为空")
             } 
             var ceck =/^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
                    cecke=ceck.test(email)
             if (cecke){
                 } else{
             alert("邮箱格式不正确")
         }
    if(pass1.value == ''){
        alert("密码不能为空")
    }
    if(pass1.value!=pass2.value){
        alert("两次输入的密码不一致")
    }

    var  checkname = /^[\u4E00-\u9FA5]+$/;
    if(checkname.test(name)==false){
        alert("请输入正确的中文名")
    }

 }




</script>








</body>
</html>